import React from "react";
import {Divider,Button, Timeline, Modal,Layout} from "antd/lib";
import Workflow from "@/services/workflow";
const {Sider,Content } = Layout;
const { confirm } = Modal;
export default class Lookcheck extends React.Component {
  state = {
    loading: true,
    comments:"",
    data:[],
    datastart:true,
  };
  componentWillMount() {
    let param={
      bill:"contracts",
      billid:this.props.id,
      bill_type:0,
      orgunitid:this.props.departmentid,
    }
   Workflow.getmessage(param).then(data => {
      let datastart=true;
       if(data.length>0) {
        data.forEach(element => {
          if(element.status===3){
            datastart=false;
          }
        });
        let datatemp=[];
        if(datastart && this.props.status===0){
          datatemp.push({updated_at:this.props.bill_date,message:"审批开始（"+ this.props.employeename+"）待提交",colors:"green",status:0,comments:"<p></p>"});
        }
        data.forEach(element => {
          datatemp.push(element);
          if(element.status===3 && this.props.status===0){
            datatemp.push({updated_at:this.props.bill_date,message:"审批开始（"+ this.props.employeename+"）待提交",colors:"green",status:0,comments:"<p></p>"});
          }
        });
         this.setState({
           data: datatemp,
           comments: datatemp[0].comments,
           loading: false,
           datastart:datastart,
         });
       }else{
        let datatemp=[];
        if(this.props.status===0){
          datatemp=[{updated_at:this.props.bill_date,message:"审批开始（"+ this.props.employeename+"）待提交",colors:"green",status:0,comments:"<p></p>"}];
        }
          this.setState({
            data:datatemp,
            loading: false,
          });
       }
      }).catch(error => {
          this.setState({
            loading: false,
          });
        });
  }
  componentDidUpdate() {
    try {
      document.getElementById("goods_detail_contentselcheck").innerHTML = this.state.comments;
    } catch (e) {
       
    }

}
  handlesel = (record) => {
    this.setState({
      comments: record.comments,
    });
    // confirm({
    //   title: '审批信息',
    //   content: record.message,
    //   okText: '确定',
    //   okType: 'danger',
    //   cancelText: '取消',
    //   onOk: () => {
    //   },
    // });
  };
  lineadd(){
    return (
      <Timeline>
        {/* {this.props.status===0 && this.state.datastart &&(<Timeline.Item color="green">
         <a>{"审批开始（"+this.props.bill_date+"，"+ this.props.employeename+"）待提交" }</a> 
        </Timeline.Item>)} */}
      {(this.state.data || []).map(item => (
        <Timeline.Item color={item.colors}>
         <a onClick={() => this.handlesel(item)}>{item.updated_at + "  " + item.message}</a> 
        </Timeline.Item>
      ))}
        {this.props.status===2 &&(<Timeline.Item color="green">
         <a>{"审批结束" }</a> 
        </Timeline.Item>)}
     </Timeline>
    );
  };
    render() {
      if (this.state.loading) return null;
      return (
            <div>
              <Divider type="horizontal" />  
      <Layout>
       <Sider width={400} style={{ background: '#fff' }}>
          {this.lineadd()}
       </Sider>
          <Content>
          <div id="goods_detail_contentselcheck"/>
        </Content>
      </Layout>
        </div>
      );
    }
}
